<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .s1{
            background-color: yellow;
            color: red;
        }
        .s2{
            background-color: dodgerblue;
            color: fuchsia;
        }
    </style>

    <script>
        function submitForm() {
            var formObj = document.getElementById("f1");
            formObj.submit();
        }

        function changeClass() {
            let spanObj = document.getElementById("testSpan");
            spanObj.className = "s2";
        }
    </script>
</head>
<body>
    <form action="ddd" id="f1">
        用户名：<input type="text" name="userName"><br>
        <input type="submit" value="提交">
    </form>
    <input type="button" value="提交表单" onclick="submitForm()">
    <br>
    <a href="../class11_10/homework1.html">跳转</a>
    <input type="button" value="跳转" onclick="location.href='../class11_10/homework1.html';">
    <br>
    <span id="testSpan" class="s1">测试</span>
    <input type="button" value="改变样式" onclick="changeClass()">
</body>
</html>